<template>
	<view class="content-header">
		<view class="top20"></view>
		<view class="header">
			<view v-if="infoList.length==0">
				<image class="not-has" src="../../static/bank/notlist.png" mode="scaleToFill"></image>
				<view class="not-txt">暂无数据</view>
			</view>
			<view v-if="infoList.length>0" class="body">
				<view v-for="item in infoList" class="ones">
					<view class="ones-top">
						<view class="flex-row flex-content-between">
							<view class="flex-column">
								<view class="ones-1">余额到{{item.gettype.title}}-{{item.getbank?item.getbank.name:'账号'}}（{{item.account_number.substr(-4)}}）</view>
								<view class="flex-row ones-2">
									<view>{{item.createtime}}</view>
									<view>手续费：￥{{item.amount-item.received_amount}}</view>
								</view>
							</view>
							<view class="flex-column ones-3">
								<view>￥{{item.amount}}</view>
								<view class="shenhezhong" v-if="item.status==0">审核中</view>
								<view class="chengong" v-if="item.status==1">提现成功</view>
								<view class="dakuanzhong" v-if="item.status==2">打款中</view>
								<view class="shengheshib" v-if="item.status==3">审核失败</view>
								<view class="dakuanshibai" v-if="item.status==4">打款失败</view>
							</view>
						</view>
						<view class="notes" v-if="item.error_msg">{{item.error_msg}}</view>
						
					</view>
					
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				page:1,
				infoList:[
				],//提现明细列表
			}
		},
		onLoad() {
			this.getWithdrawalList();
		},
		onPullDownRefresh() {
			this.page = 1;
			this.infoList = [];
			this.getWithdrawalList()
			setTimeout(()=>{
				uni.stopPullDownRefresh();
			},2000)
		},
		onReachBottom() {
			this.getWithdrawalList();
		},
		methods:{
			//获取提现列表
			getWithdrawalList(callback){
				let data = {
					page:this.page
				}
				if(data.page==0){
					return
				}
				let that = this;
				this.$api.withdrawalLog(data).then(res=>{
					console.log(res);
					if(!(callback==null||callback==undefined)){
						callback();
					}
					if(res.data.length>0){
						that.infoList.push(...res.data)
						that.page++;
					}else{
						that.page = 0
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.dakuanshibai{
		color: #55007f;
	}
	.shengheshib{
		color: #ff0000;
	}
	.dakuanzhong{
		color: #ff00ff;
	}
	.chengong{
		color: #00aa00 !important;
	}
	.shenhezhong{
		color: #ffaa00 !important;
	}
	.notes{
		color: #ED5126;
		font-size: 20rpx;
		margin-top: 10rpx;
	}
	.body{
		padding-bottom: 30rpx;
	}
	.ones-top{
		padding-top: 30rpx;
		margin-left: 20rpx;
		margin-right: 20rpx;
	}
	.ones-3{
		>view:nth-child(1){
			font-size: 32rpx;
			font-family: PingFang SC-Bold, PingFang SC;
			font-weight: bold;
			color: #333333;
		}
		>view:nth-child(2){
			font-size: 28rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #ED5126;
			margin-top: 16rpx;
		}
	}
	.ones-2{
		margin-top: 25rpx;
		>view{
			font-size: 24rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #999999;
		}
		>view:nth-child(2){
			margin-left: 50rpx;
		}
	}
	.ones-1{
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
	}
	.ones{
		width: 690rpx;
		// height: 161rpx;
		background: #FFFFFF;
		border-radius: 10rpx 10rpx 10rpx 10rpx;
		opacity: 1;
		margin-bottom: 20rpx;
		padding-bottom: 20rpx;
	}
	.not-txt{
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #999999;
		text-align: center;
		margin-top: 30rpx;
	}
	.not-has{
		width: 288rpx;
		height: 241rpx;
		margin-left: 201rpx;
		margin-top: 126rpx;
	}
	.header{
		width: 690rpx;
		margin-left: 30rpx;
		margin-right: 30rpx;
	}
</style>